@charset "UTF-8";
/* CSS Document */
body {
	font:14px/1.5 AppleGothic,Arial,'Microsoft Yahei','Simsun';
	line-height:160%;
	color:#666;
	background:#fff;}
body,html,p,h1,h2,h3,h4,h5,h6,dl,dd,dt,ul,li{	
	padding:0;
	margin:0;}
dl,dd,dt,ul,li{
	list-style:none;}
a {color: #444;
	text-decoration: none;}

a:hover {color: #333;}
.clearfix { *zoom: 1;}
.clearfix:before,
.clearfix:after {
	display: table;
	content: "";
	line-height: 0;}
.clearfix:after {clear: both;}
.tl{text-align:left;}
.tr{text-align: right;}
.tc{text-align: center;}
.fl{float:left;}
.fr{float:right;}
.underline{text-decoration:underline;}
.ct_1{color:#000;}
.ct_2{color:#333;}
.ct_3{color:#666;}
.ct_4{color:#999;}
.ct_5{color:#ccc;}
.ct_6{color:#fff;}
.ct_7{color:#0265cb;}
/* */
html,
body,
wrapper {
  height: 100%;
}
.main{
	max-width:1200px;
	margin:3px auto;
	}
#header{
	width:100%;
	height:85px;
 	position:fixed;
	z-index:1100;
	background:#0057b1;
 	top:0;
	box-shadow:0 1px 0 rgba(0,0,0,0.05);
	-webkit-transition:  0.2s ease-in 0s;
	-moz-transition:  0.2s ease-in 0s;
	-ms-transition:  0.1s ease-in 0s;
	-o-transition:  0.2s ease-in 0s;
}
#header .main {
	position:relative;
	padding:0 10px;
	}
/* ------- Menu ------- */
.wrapper{
	overflow:hidden;
	}
.pageMain{
 	margin-right:0;
	margin-left:0;
	-webkit-transition:  0.2s ease-in 0s;
	-moz-transition:  0.2s ease-in 0s;
	-ms-transition:  0.1s ease-in 0s;
	-o-transition:  0.2s ease-in 0s;
	}
.sidebar{
  	position: fixed;
	right:0;
	top:0;
	left:0;
	z-index:9999;
	}
.sidebar .main{
	position:relative;
	}

#logo{
	width:110px;
	height:82px;
	display:inline-block;
	background:url(../images/logo.png) no-repeat;
	overflow:hidden;
 	margin:0px 0 0 0;
	text-indent:-20em;
	-webkit-transition:  0.2s ease-in 0s;
	-moz-transition:  0.2s ease-in 0s;
	-ms-transition:  0.1s ease-in 0s;
	-o-transition:  0.2s ease-in 0s;
	}
.hea{color: #fff; float:right; margin-right:30px; z-index:999;}
.hea span{ line-height:35px;color: #fff; text-align:right}
.hea span a{color: #fff;}
.hea span a:hover{color: #01cc01;}

#menu{
	position: absolute;
	right:0;
	top:25px;
 }
#menu li{
	display:inline-block;
 }
#menu a{
	color:#fff;
	font-size:16px;
  	height:55px;
	width:100px;
	text-align:center;
	display: inline-block;
	line-height:50px;
	padding:0px 0 0 0;
	-webkit-transition:  0.2s ease-in 0s;
	-moz-transition:  0.2s ease-in 0s;
	-ms-transition:  0.1s ease-in 0s;
	-o-transition:  0.2s ease-in 0s;
	background:#;
}
#menu a span{
	text-align:left;
	display:inline-block;}
#menu a b{
	font-size:12px;
	color:#8d8d8d;
	font-weight:normal;
	-webkit-transition:  0.2s ease-in 0s;
	-moz-transition:  0.2s ease-in 0s;
	-ms-transition:  0.1s ease-in 0s;
	-o-transition:  0.2s ease-in 0s;
	}

#menu a:hover,
#menu a:hover b,
#menu a.current,
#menu a.current b{
	color:#fff;
	-webkit-transition:  0.2s ease-in 0s;
	-moz-transition:  0.2s ease-in 0s;
	-ms-transition:  0.1s ease-in 0s;
	-o-transition:  0.2s ease-in 0s;
}
#menu a:hover,
#menu a.current{ color:#01cc01; border-bottom:3px solid #01cc01;
	-webkit-transition:  0.2s ease-in 0s;
	-moz-transition:  0.2s ease-in 0s;
	-ms-transition:  0.1s ease-in 0s;
	-o-transition:  0.2s ease-in 0s;
	}

.scrol-page{
 	margin:10px auto;
	padding:10px 0 0 0;
  	}
@media (max-width: 960px) {
	#menu a{
 		height:50px;
		width:90px;
		padding:20px 0 0 0;
	}
	#logo{
	width:133px;
	height:33px;
	background:url(../images/logo.png) no-repeat;
	background-size:133px 33px ;
	margin:20px 0 0 0;
	}
	#header{
		height:70px;
		}
	.scrol-page{
  		padding:69px 0 0 0;
  	}

}

@media (max-width: 767px) {
	.openNav .sidebar{
		right:0;
		border-left:1px solid rgba(0,0,0,0.05);
		}
	.openNav .pageMain{
		margin-right:60px;
		margin-left:-60px;
		}
	.sidebar{
 		height:100%;
		width:70px;
		position: fixed;
		left:auto;
		right:-70px;
		top:0;
		-webkit-transition:  0.2s ease-in 0s;
		-moz-transition:  0.2s ease-in 0s;
		-ms-transition:  0.1s ease-in 0s;
		-o-transition:  0.2s ease-in 0s;
		z-index:9999;
		}
	.openNav .sidebar{
		right:0;
		}
	.openNav .pageMain{
		margin-right:70px;
		margin-left:-70px;
		}
	#menu{
		left:0;}
	#menu li{
		display:block;
		}	
	#menu a{
 		height:35px;
		width:auto;
		display:block;
		padding:5px 0 5px 8px;
		border-bottom:1px solid rgba(0,0,0,0.05);
 		line-height:35px;
		text-align:left;
 	}
	#menu a b{
		display:none;
		}
	#logo{
	width:97px;
	height:24px;
	background:url(../images/logo.png) no-repeat;
	background-size:97px 24px ;
	margin:10px 0 11px 0;
	position:fixed;
	left:10px;
	}
	#header{
		height:45px;
		}
		
	.navBox{
		width:45px;
		padding:15px 0 0 0;
		height:30px;
		position:absolute;
		left:-45px;
		top:0;
		
		}
	.navOpen{
		height:12px;
		width:22px;
		display:block;
		margin:0 auto;
		border-top:2px solid #666;
		border-bottom:2px solid #666;
		position:relative;
		z-index:1;
		}
	.navOpen:after{
		display:block;
		position:absolute;
		left:0;
		right:0;
		height:2px;
		overflow:hidden;
		content:'';
		background:#666;
		top:50%;
		margin-top:-1px;
		z-index:1;
		}
	.navBox:before{
		width:2px;
		height:18px;
 		display:block;
		content:'';
		background:#fff;
		left:14px;
		top:15px;
		position:absolute;
		z-index:333;
		}
	
}
/* banner */
.ba{ position:relative; height:700px; margin-bottom:80px;}
.slider__navi {
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	z-index: 999;
}

.slider__navi a {
	display: block;
	height: 6px;
	width: 20px;
	margin: 20px 0;
	text-indent: -9999px;
	box-shadow: none;
	border: none;
	background:#ccc;
}

.slider__navi a.active {
	background:#0265cb;
}
.flex__container {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	-webkit-flex-flow: row wrap;
	-moz-flex-flow: row wrap;
	-ms-flex-flow: row wrap;
	-o-flex-flow: row wrap;
	flex-flow: row wrap; 
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	-ms-justify-content: flex-start;
	-o-justify-content: flex-start;
	justify-content: flex-start;
	height: 100vh;
	width: 100%;
	z-index: 1;
}
.flex__container.flex--active {
	z-index: 2;
}
.text--sub {
	font-size: 30px;
	letter-spacing: 0.5rem;
	text-transform: uppercase;
	margin-bottom: 40px;
}

.text--big {
	font-size: 4.5em;
	font-weight: 700;
	line-height: 110px;
  margin-left: -8px;
}

.text--normal {
	font-size: 13px;
	color: rgba(255, 255, 255, 0.8);
	line-height: 22px;
	margin-top: 25px;
}
.text__background {
	position: absolute;
	left: 72px; width:100%;
	bottom: -60px;
	color: rgba(255,255,255,0.05);
	font-size: 120px;
	font-weight: 700;
}

.flex__item {
	height: 100vh;
	color: #fff;
	transition: transform 0.1s linear;
}
.flex__item--left {
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	align-items: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	-ms-align-items: center;
	width: 55%;
	transform-origin: left bottom;
	transition: transform 0.1s linear 0.4s;
	opacity: 0;
	position: relative;
	overflow: hidden;
}
.flex__item--right {
	width: 45%;
	transform-origin: right center;
	transition: transform 0.1s linear 0s;
	opacity: 0;
}

.flex--preStart .flex__item--left,
.flex--preStart .flex__item--right,
.flex--active .flex__item--left,
.flex--active .flex__item--right {
	opacity: 1;
}
/* 产品2 */
.flex--piplup .flex__item--left {background: #3e9fe6;}
.flex--piplup .flex__item--right {background: #d0e2f0;}
/* 产品1 */
.flex--pikachu .flex__item--left {background: #0265cb;}
.flex--pikachu .flex__item--right {background: #99cccd;}

/* 产品3 */
.flex--blaziken .flex__item--left {background: #00a922;}
.flex--blaziken .flex__item--right {background: #d9e7db;}

/* 产品 */
.flex--dialga .flex__item--left {background: #476089;}
.flex--dialga .flex__item--right {background: #ade8f7;}

.flex__content {
	margin-left: 80px;
	width: 70%;
	opacity: 1;
	transform: translate3d(0,0,0);
	transition: transform 0.2s linear 0.2s, opacity 0.1s linear 0.2s;
}
.pokemon__img {
	position: absolute;
	bottom: 100px;
	right: 15%;
	max-height: 40vw;
	opacity: 1;
	transform: translate3d(0,0,0);
	transition: opacity 0.43s 0.6s, transform 0.4s 0.65s cubic-bezier(0, 0.88, 0.4, 0.93);
}
/* Animate-START point */
.flex__container.animate--start .flex__content {
	transform: translate3d(0,-200%,0);
	opacity: 0;
}
.flex__container.animate--start .pokemon__img {
	transform: translate3d(-200px,0,0);
	opacity: 0;
}
/* Animate-END point */

.flex__container.animate--end .flex__item--left {
	transform: scaleY(0);
}

.flex__container.animate--end .flex__item--right {
	transform: scaleX(0);
}
.flex__container.animate--end .flex__content {
	transform: translate3d(0,200%,0);
	opacity: 0;
}
.flex__container.animate--end .pokemon__img {
	transform: translate3d(200px,0,0);
	opacity: 0;
}


/* 产品 */
.wrap{width:978px;margin:0 auto;}
.carousel{height:522px;overflow:hidden;background:#262626;}
.carousel .wrap{position:relative;}
.slide-caption{position:relative;z-index:10;float:left;width:376px;min-height:450px;padding:68px 40px 0;background-image:url(../images/vignette.png);background-position:left top;background-repeat:no-repeat;}
.comp-a{background-color:#000;}
.comp-b{background-color:#000;}
.comp-c{background-color:#000;}
.comp-d{background-color:#000;}
.slide-caption h2{margin-bottom:22px;color:#fff;font-size:30px;line-height:38px;font-weight:normal;}
.slide-caption h2 a{color:#fff;text-decoration:none;}
.slide-caption h2 a:hover, .slide-caption h2 a:focus{color:#e6eae2;text-decoration:none;}
.slide-callout p{line-height:20px;padding:8px 0 7px 0;color:#fff;font-size:16px;font-weight:normal;overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;}
.slide-callout p a{color:#fff;text-decoration:none;}
.slide-callout p a:hover, .slide-callout p a:focus{color:#fff;text-decoration:none;}
.slide-callout .more{padding:0;}
.comp-a .slide-callout .more{background-color:#;}
.comp-b .slide-callout .more{background-color:#0265cb;}
.comp-c .slide-callout .more{background-color:#0265cb;}
.comp-d .slide-callout .more{background-color:#fff;}
.slide-callout .more a{display:inline-block;line-height:20px;padding:8px 10px 7px;background:none;color:#333;background:#fff;text-transform:none; margin:10px 0}
.slide-callout .more a:hover, .slide-callout .more a:focus{background:#0265cb;text-decoration:none;color:#fff;}
.carousel-image{position:absolute;right:0;top:0;}
.carousel-image img{ width:522px; height:522px;}
.carousel-item{position:relative;}
.carousel-item-secondary{display:none;}
*html .carousel{height:348px!important;}
*html .slide-caption{background-image:none !important;height:280px;overflow:hidden;}
*html .carousel-item{height:348px;}
.comp-b, .comp-b .slide-callout .more{background-color:#000;}
.comp-c, .comp-c .slide-callout .more{background-color:#000;}
.comp-d, .comp-d .slide-callout .more{background-color:#000;}
.carousel-controls{position:absolute;z-index:100;left:50%;bottom:43px;width:98px;height:32px;margin-left:-449px;overflow:hidden;}
* html .carousel-controls{bottom:20px;}
.carousel-controls a{float:left;display:block;width:32px;height:32px;text-indent:-9999px;background-image:url(../images/controls-carousel.gif);background-color:transparent;background-position:0 0;background-repeat:no-repeat;overflow:hidden;}
.carousel-controls .next{background-position:-99px -32px;border-left:1px solid #333;}
.carousel-controls .next:hover, .carousel-controls .next:focus{background-position:-99px 0;border-color:#ccc;}
.carousel-controls .previous{background-position:0 -32px;}
.carousel-controls .previous:hover, .carousel-controls .previous:focus{background-position:0 0;}
.carousel-controls .pause{background-position:-33px -32px;border-left:1px solid #333;}
.carousel-controls .pause:hover, .carousel-controls .pause:focus{background-position:-33px 0;border-color:#ccc;}
.carousel-controls .play{position:relative;bottom:auto;left:auto;background-position:-66px -32px;border-left:1px solid #333;}
.carousel-controls .play:hover, .carousel-controls .play:focus{background-position:-66px 0;border-color:#ccc;}
.carousel .prev-image{position:absolute;left:-978px;top:0;opacity:0.2;}
.carousel .next-image{position:absolute;top:0;right:-522px;opacity:0.2;}

.title{
	font-size:30px;
	color:#000;
	text-align:center;
	padding:50px 0 50px 0;
 	}
.title b{
 	font-size:12px;
	color:#666;
	line-height:16px;
	display:inline-block;
	padding:10px 0 0 0;
	margin-bottom:-10px;
	}
.title span{
	display: inline-block;
	line-height:40px;
 	position:relative;
	padding:0 6%;
	font-weight:normal;
    }
.title span:before{
	width:100%;
	height:1px;
	background:#333;
	position: absolute;
	left:0;
	right:0;
	content:'';
	bottom:-20px;
	 
	}
.title span:after{
	display:block;
	overflow:hidden;
	content:'';
	background:#333;
	border:10px solid #fff;
	position:absolute;
	left:50%;
	width:4px;
	bottom:-32px;
	height:4px;
	border-radius:100%;
	margin-left:-12px;
	}
.infoText{
	text-align:center;
	color:#777; font-weight:100;
	font-size:14px;
	}

	
.servicesBox{ position: relative;
	margin:80px 0 30px 0;
	}
.servicesBox li{
	width:33%;
	float:left;
	}
.servicesBox li h3{
	font-size:20px;
	color:#333; text-align:center;
	padding:5px 0;
	}
.servicesBox li p{
	color:#777;
	font-size:12px;
	line-height:200%;
 	text-align: center;
    }
 	
.servicesBoxList{
	padding:0 35px;
	}
.servicesBoxIcon{
	padding:0 0 20px 110px;
	}	
.servicesBoxIcon i {
        display: inline-block;
        cursor: pointer;
        width: 90px;
        line-height:90px;
        height: 90px;
        border-radius: 50%;
        text-align: center;
        position: relative;
        z-index: 1;
        color: #333;
        font-size:16px;
		background:#fff;
		border:1px solid #a3a3a3;
        transition: background 0.2s, color 0.2s;
		
 }	
.servicesBoxIcon i:after {
        pointer-events: none;
        position: absolute;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        content: '';
        box-sizing: content-box;
}	
.servicesBoxIcon i:after {
        top: -7px;
        left: -7px;
        padding: 7px;
        box-shadow: 0 0 0 4px #0265cb;
        transition: transform 0.2s, opacity 0.2s;
        transform: scale(.8);
        opacity: 0;
}
.servicesBoxIcon i:hover {
         color: #fff;
		border:1px solid #fff;
}	
.servicesBoxIcon i:hover:after {
        transform: scale(1);
        opacity: 1;
}	
.servicesBoxIcon i:before{
	width:40px;
	height:40px;
	display:block;
	position:absolute;
	content:'';
	background-image:url(../images/icon.png);
	background-repeat:no-repeat;
	background-size:228px 61px;
	top:50%;
	left:55%;
	margin:-20px 0 0 -20px;
 	}
.servicesIcon_1:before{
	background-position:3px 5px;}
.servicesIcon_2:before{
	background-position:-67px 5px;}
.servicesIcon_3:before{
	background-position:-130px 7px;}
.servicesIcon_4:before{
	background-position:-195px 7px;}


#about{
	background:#fff;
	padding-top:90px;
	}
.aboutBox{
	position:relative;
	}
.aboutBox img{ margin-right:30px; float:left}

.aboutBox h4{
	font-size:18px;
	color:#000;
	font-weight:normal;
	text-align:center;
	padding:20px 0;
	}
.aboutBox p{
	padding-bottom:10px;
	font-size:14px; color:#444;
	}	
.aboutBox{
	line-height:220%;
	}
.abmore{
	border:3px solid #ccc;
	color:#444;
	height:40px;
	line-height:40px;
	padding:0 4%;
	display:inline-block;
	 -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
   }
.abmore:hover{
	border:3px solid #0265cb;
	color:#000;
	padding:0 7%;
	 
	
   }
#about .title span:after{
	border:10px solid #fafcfc;
	}

/*横幅*/
.ab_3{
	background:url(/Data/hkzwen/upload/image/20220322/首页横幅1.jpg) no-repeat center #000;
	text-align:center;
	padding:80px 10px;
	margin-top:100px;
	overflow:hidden;
	height:140px;
	}
.ab_3 h2{
	font-size:35px;
	color:#fff;
	line-height:120%;
	padding-bottom:40px;
	height:40px;
	}
.viewBtn{
	border:3px solid rgba(255,255,255,0.6);
	color:#fff;
	height:40px;
	line-height:40px;
	padding:0 4%;
	display:inline-block;
	 -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
   }
.viewBtn:hover{
	border:3px solid #fff;
	color:#fff;
	padding:0 7%;
   }


/*新闻*/
.i-news{
	padding:0 10px;
	}
.i-news li{
	width:33.33333333%;
	float:left;
	padding:40px 0;
	}
.i-news ul{
	margin-left:-50px;
	}
.i-newsBox{
	margin-left:50px;
	}
.i-news h4 {
	padding-bottom:10px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	}
.i-news h4 a{
	font-size:16px;
	color:#000; font-weight:bold;
	display:block;
	 -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
	}
.i-news h4 a:hover{
	color:#0265cb;
	}
.i-newsDeta{ color:#777; margin-top:10px;border-bottom:1px solid #eee;}
.i-newsViewText{
	padding:20px 0;
	line-height:160%;
	height:40px;
	font-size:12px;
	color:#666;
	overflow:hidden;
	}
.i-newsMore{
	display:inline-block;
	padding:0 15px; margin-top:10px;
	border:1px solid #555;
	border-radius:3px;
	height:28px;
	line-height:28px;
	font-size:12px;
	background:#fff;
	 -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
	}
.i-newsMore:hover{
	color:#fff;
	text-decoration:none;
	border:1px solid #0265cb;
	background:#0265cb;
	}


.fn_bg{ width:100%; margin-top:40px; background:#0057b1; padding:40px 0;}
.fn_m{ width:1200px; margin:0px auto; color:#cddded;}
.fn_m .code{ width:125px; float:left;}
.fn_m .code li{ width:100px; float:left; margin-right:10px;}
.fn_m .code li img{ width:100px; height:100px; vertical-align:top;}
.fn_m .code li p{ width:100%; font-size:14px; text-align:center; line-height:30px; margin-top:5px}
.fn_m .f_nav{ width:600px; float:left;}
.f_nav li{ width:120px; float:left; margin-right:50px;}
.f_nav li b{ display:block; width:100%; height:40px; line-height:40px; font-weight:300; color:#fff; font-size:15px;}
.f_nav li b a{ font-size:15px; color:#fff;}
.f_nav li b a:hover{ color:#02cb01;}
.f_nav li p{ width:100%; height:28px; line-height:28px;}
.f_nav li p a{ font-size:14px; color:#cddded;}
.f_nav li p a:hover{ color:#02cb01;}
.fn_m .f_ct{ width:320px; float:right;}
.fn_m .f_ct ul{ width:100%; margin-bottom:15px;} 
.fn_m .f_ct ul li{ margin-bottom:10px;color:#cddded;}
.f_bg{ width:100%; padding:15px 0 10px; background:#0265cb;}
.foot{ width:1200px; margin:0px auto; text-align:center; font-size:13px; color:#cddded;}
.foot span{ display:inline-block; *display:inline; zoom:1; vertical-align:top; margin:0 5px 5px;}


/********************************************************内页样式*************************************************************/
.bannerll{height:510px;}
.ba1{ height:400px; position: relative;top:85px;}
.ba1 h3{ font-size:30px; font-weight:100; color:#fff; text-align:center; margin-bottom:30px; padding-top:160px;}
.ba1 p{ font-size:14px; color:#fff; text-align:center;}

.home{ height:50px; border-bottom:1px solid #f1f1f1}
.home-wz{ width:1200px; margin:0 auto; text-align:left; line-height:50px; color:#000}
.home-wz a:hover{ color:#02cb01;}

.about{}
.tabBox_t , .tabBox  {width:100%;text-align:left; padding:10px 0; background:#eee;}
.tabBox .tabNav {overflow: hidden; width:100%; text-align:center;}
.tabBox .tabNav li { display:inline-block; *display:inline; zoom:1; text-align:center; cursor:pointer; width:160px; height:38px; text-align:center; line-height:38px; color:#444; vertical-align:top; font-size:14px; background:#fff;}
.tabBox .tabNav li.now { background:#0265cb; color:#fff}
.tabBox .tabNav li.now a{ color:#fff}
.tabBox .tabNav li:hover{ background:#0265cb; color:#fff}
.tabBox .tabNav li a:hover{ color:#fff}

.about-con{ width:1200px; margin:30px auto; line-height:30px; color:#444;}
.about-con .tu{ width:358px; float:left; margin-right:70px}

.pro{ width:1200px; margin:0 auto; line-height:175%; text-align:center;}
.pro ul{ width:100%; padding-top:40px;}
.pro ul li{ width:600px; float:left; margin-right:0px;}
.pro ul li .tu{ width:550px; height:348px; text-align:center;}
.pro ul li .tu img{ width:550px; height:348px;}
.pro ul li .wz{ width:509px; float:left; text-align:left; line-height:25px; font-size:14px; padding:20px; background:#fff; border:1px solid #eee; margin-bottom:10px;}
.pro .wz1{ width:509px; text-align:left; float:right; line-height:25px; font-size:14px; padding:20px; background:#fff; border:1px solid #eee; margin:30px auto;}

/* demo style */
.imgbox{position:relative; margin:30px auto; float:left;}
.probox{width:550px; height:348px;}
.probox img{width:430px; height:405px;vertical-align:top;}
.showbox{display:none;position:absolute;left:550px;top:0;width:550px;height:348px;overflow:hidden;}
.showbox img{position:absolute;height:348px;width:550px;}
.hoverbox{display:none;position:absolute;top:0;background:#09f;border:1px solid #09f;height:75px;width:100px;cursor:move;z-index:10;}

.pro-xl{ width:1200px; height: auto; margin:30px auto; background:#fff; font-family:'微软雅黑';}
.pro-xl .tab{ overflow:hidden; background:#eee;}
.pro-xl .tab a{ display:block; padding:10px 20px; float:left; text-decoration:none; color:#333;}
.pro-xl .tab a:hover{ background:#0265cb; color:#fff; text-decoration:none;}
.pro-xl .tab a.on{ background:#0265cb; color:#fff; text-decoration:none;}
.pro-xl .content{ overflow:hidden;}
.pro-xl .content ul{ width:100%; padding-top:20px;}
.pro-xl .content li{ display:none; text-align:left; color:#444; width:100%;}

.pro-nav{ width:1200px; margin:0 auto; text-align:center; line-height:32px}
.pro-nav a:hover{ background:#0265cb; color:#fff; text-decoration:none;}
.news{
	padding:0 10px;
	}
.news li{
	width:100%;
	float:left;
	padding:40px 0;
	}
.news ul{
	margin-left:-50px;
	}
.newsBox{
	margin-left:50px;
	}
.news h4 {
	padding-bottom:10px;
	overflow: hidden; text-align:center;
    text-overflow: ellipsis;
    white-space: nowrap;
	}
.news h4 a{
	font-size:16px;
	color:#000; font-weight:bold;
	display:block;
	 -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
	}
.news h4 a:hover{
	color:#0265cb;
	}
.newsDeta{ color:#777; margin-top:10px; text-align:center;border-bottom:1px solid #eee;}
.newsViewText{
	padding:20px 0;
	line-height:160%;
	height:40px;
	font-size:12px;
	color:#666;
	overflow:hidden;
	}
.newsMore{
	display:inline-block;
	padding:0 15px; margin-top:10px;
	border:1px solid #0265cb;
	border-radius:3px;
	height:28px;
	line-height:28px;
	font-size:12px;color:#fff;
	background:#0265cb;
	 -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
	}
.newsMore:hover{
	color:#fff;
	text-decoration:none;
	border:1px solid #000;
	background:#000;
	}

.cotnact{ width:1200px; margin:30px auto}
.cotnact h1{ width:100%; padding:40px 0; text-align:center; font-size:24px; color:#444;}
.cotnact dl{ width:100%; padding-bottom:40px; border-bottom:1px solid #ddd;}
.cotnact dl dt,.cotnact dl dt img{ width:150px; height:150px; float:right; text-align:center; vertical-align:top;}
.cotnact dl dd{ width:430px; float:left; text-align:left;}
.cotnact dl dd b{ display:block; width:100%; height:40px; line-height:40px; font-size:16px; color:#0265cb;}
.cotnact dl dd p{ width:100%; font-size:14px; color:#444; line-height:150%; margin-bottom:10px;}

 @media (max-width: 1024px) {  
 .ad_2,.ad_3{
	 height:auto;
	 }
   .ab_3{
		background-size:auto 150%;
   }
   .messageRow_1{
	   padding-bottom:20px;
	   width:auto;
	   }
   .messageRow_2{
	    clear:both;
	   float:left;
	   width:40%;
		}
	.messageRow_3{
 	   width:60%;
	   float:left;
		}
 }
@media (max-width: 767px) {
	.servicesBox li{
	width:50%;
	position:relative;
	text-align:center;
	padding-bottom:20px;
	}
	.servicesBox:before{
		display:none;
	}
	.servicesBox li:before{
	width:100%;
	height:1px;
	background:#eee;
	position: absolute;
	left:0;
	right:0;
	content:'';
 	top:47px;	 
	}
	.ad_1{
		margin-top:20px;
		background-size:auto 260%;
		height:140px;
 		}
	.ad_1Text{
		font-size:30px;
		line-height:140px;
		background-size:auto 100%;
		}
	.caseNav{
		padding-top:20px;}
	.caseNav li{
		
		}
	.caseNav li a{
		font-size:12px;
		height:24px;
		line-height:24px;
		padding:0 5px;
		margin:0;
		}
	.case{
		padding-top:0;
		}
	.case li{
	width:33.333333333%;
 	}
	#about{
 	padding:20px 0;
	}
	.aboutBox{
	position:relative;
	margin:0 10px;
	}
.aboutBox:before,
.aboutBox:after{
	display:none;
	
	}
	.aboutBox h4{
	font-size:16px;
	 
	padding:10px 0;
	}
.aboutBox{
	text-align:center;
	line-height:180%;
	}
 .i-news li{
	width:50%;
 	padding:20px 0;
	}
.i-news ul{
	margin-left:-30px;
	}
.i-newsBox{
	margin-left:30px;
	}
	.ad_2{
 	
	padding:40px 10px;
	margin-top:50px;
	background-size:auto 260%;
	}
	.ab_3{
	background-size:auto 150%;
	padding:40px 10px;
	margin-top:50px;
	overflow:hidden;	
	}
.ab_3 h2{
	font-size:24px;
 	line-height:120%;
	padding-bottom:20px;
	}
	.contactFoot{
		position:relative;
		}
	.contactFoot dl{
	width:auto;
	float:none;
	padding:10px 0;
	}
	 .title span{
		display:block;
		margin:0 10px;
		font-size:24px;
		}
	.title b{
		margin:0 0 5px 0;}
	.paging{
		text-align:center;
		padding:20px 0;
		}
	.paging a{
 		height:30px;
		padding:0 20px;
		line-height:30px;
		margin:0 2px;
		font-size:12px;
		border-width:2px !important;
		}
}
@media (max-width: 480px) {
	.infoText{
		
		font-size:14px;
 		}
	.servicesBox{
		margin-top:30px;
		}
	.servicesBox li{
		width:auto;
		float:none;
		}
	.servicesBoxIcon{
		padding-left:0;
		}
	.title{
		font-size:28px;
 		padding:20px 0 30px 0;
		}
	.title span{
 		line-height:30px;
		padding:0 5%;
		}
	.title span:before{
		
		bottom:-10px;
		 
		}
	.title span:after{
		bottom:-22px;
		}
	.case li{
	width:50%;
 	}
	.case ul{
		margin-left:-10px;
		}
	.view-tenth{
	
	margin:10px 0 0 10px;
	}
	.moreBtn{
	border:2px solid #717171;
	display:block;
	text-align:center;
	
	}
	.moreBox{
	padding:20px 0 0 0;}
	
	.i-news li{
	width:auto;
	float:none;
 	padding:15px 0;
	text-align:center;
	}

.newsViewText{
	padding:10px 0;
	height:auto;
	}

	.ab_3{
		background-size:auto 120%;
		padding:30px 10px;
		margin-top:50px;
		overflow:hidden;	
		}
	.ab_3 h2{
		font-size:18px;
		 
		padding-bottom:10px;
		}
	.viewBtn{
		display:block;
		border-width:2px;
		}
	.contactBox:after{
		display:none;
		}
	.footer{
		padding:20px 0;
		}
	.messageRow_1,
	.messageRow_2,
	.messageRow_3{
		float:none;
		padding:10px 0;
 	   width:auto;
	   }
	   .messageRow_3 {
		   padding-top:0;}
		  .messageRow_2 {
		   padding-bottom:0;}
	  .messageRow_3 .messageBox{
	padding-left:0;
	}
	.fromBtn{
		display:block;
		margin-bottom:5px;
		}
	.message{
		padding:0 10px;
		}
  
}













.c-banner{
	width: 100%;
	position: relative;
}
.c-banner img{
	width: 100%;
}
.c-banner .banner ul{
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0px;
}
.c-banner .banner ul li{
	position: absolute
	display: none;
	opacity: 0;
}
.c-banner .banner ul li:nth-child(1){
	opacity: 1;
	display: block;
}
.c-banner .banner ul li img{
	width: 100%;
	position: absolute;
	top: 0px;
}
.c-banner .banner ul li:first-child img{
	position: relative;
}
.c-banner .nexImg,.c-banner .preImg{
	padding: 25px 10px 25px 10px;
	position: absolute;
	top: 50%;
	margin-top: -53px;
	background: #000000;
	opacity: 0.5;
	border-radius: 5px;
	z-index: 10;
	
}
.c-banner .nexImg:hover,.c-banner .preImg:hover{
	opacity: 0.8;
}
.c-banner .nexImg{
	right: 0px;
}
.c-banner .nexImg img,.c-banner .preImg img{
	
	
}
.c-banner .jumpBtn{
	width: 100%;
	position: absolute;
	bottom: 20px;
	text-align: center;
	top: 95%;
}
.c-banner .jumpBtn ul{
	margin-bottom: 0px;
	padding: 0px;
}

.c-banner .jumpBtn ul li{
	width: 20px;
	height: 20px;
	border-radius: 50%;
	display: inline-block;
	background-color: white;
	opacity: 0.9;
	margin-left: 10px;
}
.c-banner .jumpBtn ul li:first-child{
	margin-left: 0px;
}
@media screen and (max-width:768px) {
	.c-banner{
		width: 100%;
		height: 345px;
		overflow: hidden;
	}
	.c-banner .banner ul li img{
		width: 768px;
		height: 345px;
		position: absolute;
		left: 50%;
		margin-left: -384px;
	}
}






















.sidebar-content{position: fixed; top: 60%; right: 0; z-index: 1000; margin-top: -280px;}
.sidebar-box{position: relative; margin-top: 1px;}
.sidebar-icon{width: 50px; height: 50px; cursor: pointer;}
.si1 .sidebar-icon{background: #0057b1 url(../images/side1.png) no-repeat center center;}
.si2 .sidebar-icon{background: #0057b1 url(../images/side2.png) no-repeat center center;}
.si3 .sidebar-icon{background: #0057b1 url(../images/side3.png) no-repeat center center;}
.si4 .sidebar-icon{background: #0057b1 url(../images/side4.png) no-repeat center center;}
.si5 .sidebar-icon{background: #0057b1 url(../images/side5.png) no-repeat center center;}
.si1:hover .sidebar-icon{background: #ff963a url(../images/side1.png) no-repeat center center;}
.si2:hover .sidebar-icon{background: #ff963a url(../images/side2.png) no-repeat center center;}
.si3:hover .sidebar-icon{background: #ff963a url(../images/side3.png) no-repeat center center;}
.si4:hover .sidebar-icon{background: #ff963a url(../images/side4.png) no-repeat center center;}
.si5:hover .sidebar-icon{background: #ff963a url(../images/side5.png) no-repeat center center;}
.sidebar-dark1{position: absolute; top: 0; right: 50px; padding: 0 20px; background-color: #ff963a; display: none;}
.sidebar-dark2{position: absolute; top: 0; right: 50px; padding: 16px 20px; background-color: #ff963a; display: none;}
.sidebar-box:hover .sidebar-dark1{display: block;}
.sidebar-box:hover .sidebar-dark2{display: block;}
.sidebar-dark1 p a{display: block; height: 50px; line-height: 50px; font-size: 16px; color: white; text-align: center; white-space: nowrap;}
.sidebar-code{width: 98px; margin-top: 8px;}
.sidebar-dark2 .sidebar-code:first-child{margin-top: 0;}
.sidebar-code p{text-align: center; color: white; line-height: 18px; margin-top: 4px;}
.sidebar-top{display: block; width: 50px; height: 50px;}
.sidebar-icon-a{display: block; width: 50px; height: 50px;}
.side-layer{position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1001; display: none;}
.side-layer-bg{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.5;}